﻿@page "/tree-grid/aggregate"

@using Syncfusion.Blazor.TreeGrid
@using Syncfusion.Blazor.Grids
@using Syncfusion.Blazor.Data
@*Hidden:Lines*@
@inherits SampleBaseComponent;
@using ej2_blazor_summarydata
@*End:Hidden*@

<SampleDescription>
    <p>This sample demonstrates aggregate functionality of the Tree Grid.</p>
</SampleDescription>
<ActionDescription>
    <p>The Tree Grid supports aggregates which will be displayed at the footer. The aggregate configurations can be provided by the <code> TreegridAggregates</code> property.</p>
    <p>The built-in aggregates are,</p>
    <ul>
        <li><code>Sum</code></li>     
        <li><code>Average</code></li>     
        <li><code>Min</code></li>     
        <li><code>Max</code></li>     
        <li><code>Count</code></li>     
        <li><code>TrueCount</code></li>     
        <li><code>FalseCount</code></li>     
    </ul>    
    <p>In this demo, the <code>FooterTemplate</code> property is used to display the Sum value for Duration column TrueCount value for the Approved column.    </p>
    <p>More information about conditional formatting can be found in this <a target='_blank' href='https://blazor.syncfusion.com/documentation/treegrid/aggregate/'> documentation</a> section.</p>
</ActionDescription>


<div class="col-lg-12 control-section">
    <div class="content-wrapper">
        <div class="row">
            <SfTreeGrid DataSource="@TreeData" IdMapping="ID" ParentIdMapping="ParentID" Height="315" TreeColumnIndex="1">
                <TreeGridAggregates>
                    <TreeGridAggregate>
                        <TreeGridAggregateColumns>
                            <TreeGridAggregateColumn Field="UnitWeight" Type="Syncfusion.Blazor.Grids.AggregateType.Max">
                                <FooterTemplate>
                                    @{
                                        var Maxvalue = (context as Syncfusion.Blazor.Grids.AggregateTemplateContext);
                                        <div>
                                            <p>Maximum: @Maxvalue.Max</p>
                                        </div>
                                    }
                                </FooterTemplate>
                            </TreeGridAggregateColumn>
                            <TreeGridAggregateColumn Field="TotalUnits" Type="Syncfusion.Blazor.Grids.AggregateType.Min">
                                <FooterTemplate>
                                    @{
                                        var Minvalue = (context as Syncfusion.Blazor.Grids.AggregateTemplateContext);
                                        <div>
                                            <p>Minimum: @Minvalue.Min</p>
                                        </div>
                                    }
                                </FooterTemplate>
                            </TreeGridAggregateColumn>
                        </TreeGridAggregateColumns>
                    </TreeGridAggregate>
                </TreeGridAggregates>
                <TreeGridColumns>
                    <TreeGridColumn Field="FreightID" HeaderText="Freight ID" Width="130" TextAlign="TextAlign.Left"></TreeGridColumn>
                    <TreeGridColumn Field="FreightName" HeaderText="Freight Name" Width="220" TextAlign="TextAlign.Left" ></TreeGridColumn>
                    <TreeGridColumn Field="TotalCosts" HeaderText="Total Costs" Width="100" TextAlign="TextAlign.Right"></TreeGridColumn>
                    <TreeGridColumn Field="UnitWeight" HeaderText="Weight Per Unit" Width="140" TextAlign="Syncfusion.Blazor.Grids.TextAlign.Right"></TreeGridColumn>
                    <TreeGridColumn Field="TotalUnits" HeaderText="Total Units" Width="140" TextAlign="TextAlign.Right"></TreeGridColumn>
                </TreeGridColumns>
            </SfTreeGrid>
        </div>
    </div>
</div>

@code{

    public List<SummaryRowData> TreeData { get; set; }

    protected override void OnInitialized()
    {
        this.TreeData = SummaryRowData.GetSummaryData().Take(12).ToList();
    }
}
